import 'package:enjoy_plus/models/repair_model.dart';
import 'package:enjoy_plus/utils/http.dart';
import 'package:enjoy_plus/utils/logger.dart';
import 'package:flutter/material.dart';
import 'package:tdesign_flutter/tdesign_flutter.dart';

class MyRepairList extends StatefulWidget {
  const MyRepairList({super.key});

  @override
  State<MyRepairList> createState() => _MyRepairListState();
}

class _MyRepairListState extends State<MyRepairList> {
  List<RepairListRow> repairList = [];
  bool isLoading = true;

  /// 获取我的报修列表
  getMyRepairList() async {
    setState(() {
      isLoading = true;
    });
    try {
      final res = await http.get<RepairListResponse>(
        '/repair',
        fromJson: (json) {
          print('API Response: $json');
          return RepairListResponse.fromJson(json);
        },
      );
      setState(() {
        repairList = res.data.rows;
        isLoading = false;
      });
    } catch (e) {
      print('Error: $e');
      setState(() {
        isLoading = false;
      });
    }
  }

  @override
  void initState() {
    super.initState();
    getMyRepairList();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: const Color.fromARGB(255, 241, 238, 238),
      appBar: AppBar(
        title: const Text('我的报修'),
        backgroundColor: const Color(0xFFF1F2F6),
        centerTitle: true,
        leading: IconButton(
            onPressed: () => Navigator.pop(context),
            icon: const Icon(Icons.arrow_back_ios)),
      ),
      body: Container(
        color: const Color(0xFFF1F2F6),
        child: isLoading
            ? const Center(child: CircularProgressIndicator(color: Colors.blue))
            : Column(children: [
                Expanded(
                    child: ListView.builder(
                        itemCount: repairList.length,
                        itemBuilder: (context, index) =>
                            RepairListRowWidget(repairList[index]))),
                Positioned(
                    bottom: 0,
                    left: 0,
                    right: 0,
                    child: Container(
                        padding: const EdgeInsets.only(
                            left: 10, right: 10, bottom: 10),
                        color: Colors.transparent,
                        child: Row(children: [
                          Expanded(
                              child: ElevatedButton(
                                  style: ElevatedButton.styleFrom(
                                      backgroundColor: Colors.white,
                                      foregroundColor: Colors.blue),
                                  onPressed: () => Navigator.pushNamed(
                                      context, '/addRepair'),
                                  child: const Column(children: [
                                    SizedBox(height: 5),
                                    Icon(Icons.add),
                                    Text('在线报修'),
                                    SizedBox(height: 5),
                                  ])))
                        ])))
              ]),
      ),
    );
  }
}

class RepairListRowWidget extends StatelessWidget {
  final RepairListRow repair;
  const RepairListRowWidget(this.repair, {super.key});

  /// 状态文本 0已取消1受理中2上门中3已完成
  static const List<String> statusList = ['已取消', '受理中', '上门中', '已完成'];
  static const List<TDTagTheme?> statusThemeList = [
    null,
    TDTagTheme.primary,
    TDTagTheme.success,
    TDTagTheme.warning
  ];

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        Navigator.pushNamed(
          context,
          '/repairDetail',
          arguments: repair,
        );
      },
      child: Card(
        color: Colors.white,
        margin: const EdgeInsets.all(10),
        child: Padding(
          padding: const EdgeInsets.all(16),
          child: Column(children: [
            Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
              Text(repair.repairItemName,
                  style: const TextStyle(
                      color: Colors.black87, fontWeight: FontWeight.w600)),
              TDTag(
                statusList[repair.status],
                isLight: true,
                theme: statusThemeList[repair.status],
              ),
            ]),
            const SizedBox(height: 10),
            //分割线
            const Divider(
              height: 1,
              color: Color.fromARGB(255, 235, 235, 235),
            ),
            const SizedBox(height: 10),
            Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
              const Text('报修项目', style: TextStyle(color: Colors.black38)),
              Text(repair.repairItemName),
            ]),
            const SizedBox(height: 10),
            //预约时间
            Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
              const Text('预约时间', style: TextStyle(color: Colors.black38)),
              Text(repair.appointment),
            ]),
            const SizedBox(height: 10),
            //联系电话
            Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
              const Text('电话号码', style: TextStyle(color: Colors.black38)),
              Text(repair.mobile),
            ]),
          ]),
        ),
      ),
    );
  }
}
